<template>
	<!-- 时间 -->
	<view class="filter-date">
		<view style="font-weight: 500;">时间</view>
		<view class="content_box">
			<view class="thsj" @click="fnShowTimePicker(0)">
				<view style="display: flex;align-items: center;line-height: 60rpx;color: #828282;font-size: 26rpx;">
					<u-icon name="order" size="28"></u-icon>
					{{startTime?startTime:'请选择开始时间'}}
				</view>
				<u-icon name="arrow-down-fill" size="14"></u-icon>
			</view>
			<view class="thsj" @click="fnShowTimePicker(1)">
				<view style="display: flex;align-items: center;line-height: 60rpx;color: #828282;font-size: 26rpx;">
					<u-icon name="order" size="28"></u-icon>
					{{endTime?endTime:'请选择结束时间'}}
				</view>
				<u-icon name="arrow-down-fill" size="14"></u-icon>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		props: {
			startTime: {
				type: String,
				default: ''
			},
			endTime: {
				type: String,
				default: ''
			},
		},
		data() {
			return {
				value1: Number(new Date()), //默认时间
				maxDate: Number(new Date()), //最大时间
			}
		},
		watch: {

		},
		methods: {
			formatter(type, value) {
				if (type === 'year') {
					return `${value}年`
				}
				if (type === 'month') {
					return `${value}月`
				}
				if (type === 'day') {
					return `${value}日`
				}
				return value
			},
			// 关闭时间弹窗
			fnCloseTimePicker() {
				this.showStartTime = false
				this.showEndTime = false
			},
			// // 确定时间
			// fnConfirm(e, index) {
			// 	let date = uni.$u.timeFormat(e.value, 'yyyy-mm-dd');
			// 	if (index == 0) {
			// 		this.$emit('update:startTime', date)
			// 		this.fnCloseTimePicker()
			// 	} else {
			// 		if (e.value > Number(new Date(this.startTime))) {
			// 			this.$emit('update:endTime', date)
			// 			this.fnCloseTimePicker()
			// 		} else {
			// 			this.$Msg.Toast('结束时间必须大于开始时间')
			// 		}
			// 	}
			// },
			// 查看时间弹窗
			fnShowTimePicker(index) {
				if (index == 1) {
					if (!this.startTime) return this.$Msg.Toast('请选择开始时间')
				}
				this.$emit('changeDate', index)
			},
		}
	}
</script>
<style scoped lang="scss">
	.filter-date {
		.content_box {
			margin-top: 20rpx;

			.thsj {
				display: flex;
				justify-content: space-between;
				background: #F5F6FA;
				height: 60rpx;
				padding: 0 24rpx;
			}

			.thsj:first-child {
				margin: 0 0 24rpx 0;
			}
		}
	}
</style>
